<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" />
    <meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
    <title>云钢</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui-flex.css">
    <link rel="stylesheet" type="text/css" href="../css/style.css" />
    <style>
        /* body{ background: url('../image/me/bj03.jpg') no-repeat top center; background-size: 100% auto; } */
        body{ background-image: url('../image/me/bj03.jpg'); background-position: top center; background-size: 100% auto; background-repeat: no-repeat; }
        #header{ background-image: none; }
        .headerimg{ width: 80%; height: auto; border-radius: 10rem; box-shadow: 0 0 5px #49e8ff; }
        .vipbox{ height: 2.5rem; line-height: 2.5rem; color: #5D3303; border-radius: 2.5rem; overflow: hidden; }
        .viptext{ background: #EECB93; }
        .vippay{ background: #4c4c4c; color: #EECB93; }
        .bottombox{ color: #D2D2D2; height: 5rem; margin-top: 3rem; }
        .ershou{ box-shadow: 0 0 3px #ffbfc5; border-radius: 5px; }
        .ershou li{ box-shadow: 0 3px 0 #ff97a0; border-radius: 5px; }
        .ershou .aui-list-item{ padding-top: 0.3rem; padding-bottom: 0.3rem; }
        .huishou{ box-shadow: 0 0 3px #83a5f5; border-radius: 5px; }
        .huishou li{ box-shadow: 0 3px 0 #7ca4ff; border-radius: 5px; }
        .huishou .aui-list-item{ padding-top: 0.3rem; padding-bottom: 0.3rem; }
        .caigou{ box-shadow: 0 0 3px #1CB294; border-radius: 5px; }
        .caigou>div{ box-shadow: 0 3px 0 #1CB294; border-radius: 5px; }
        .caigou .img{ width: 3rem; position: relative; padding: 0.75rem 0; margin: 0 auto; }
        .caigou .img img{ width: 75%; display: block; border-radius: 50%; margin: 0 auto; }
        .huowu{ box-shadow: 0 0 3px #FEBC44; border-radius: 5px; }
        .huowu>div{ box-shadow: 0 3px 0 #FEBC44; border-radius: 5px; }
        .huowu .img{ width: 3rem; position: relative; padding: 0.75rem 0; margin: 0 auto; }
        .huowu .img img{ width: 75%; display: block; border-radius: 50%; margin: 0 auto; }
    </style>
</head>

<body>
    <header class="aui-bar aui-bar-nav aui-bar-light bg0" id="header">
        <a class="aui-pull-left aui-btn">
            
        </a>
        <div class="aui-title text-white">我的</div>
    </header>
    <div id="app" v-cloak>
        <div class="margin-xxl margin-lr">
            <div class="aui-flex-col">
                <div class="aui-flex-item-3">
                    <img src="../image/me/header.jpg" class="headerimg">
                </div>
                <div class="aui-flex-item-9">
                    <div class="text-white margin-top-xs">用户昵称</div>
                    <div class="text-white text-sm margin-top">请先登录，以便更好的体验平台功能~</div>
                </div>
            </div>
            <div class="aui-flex-col margin-top-xxl text-center vipbox">
                <div class="aui-flex-item-8 viptext">
                    开通会员享专属权益
                </div>
                <div class="aui-flex-item-4 vippay">
                    立即开通
                </div>
            </div>
        </div>
        <div style="background: #f5f5f5;">
            <div class="margin margin-top-xxl">
                <div class="text-black text-bold padding-top">我的发布</div>
                <div class="aui-flex-col margin-top">
                    <div class="aui-flex-item-6 padding-right-xs">
                        <ul class="aui-list aui-media-list ershou">
                            <li class="aui-list-item aui-list-item-middle">
                                <div class="aui-media-list-item-inner">
                                    <div class="aui-list-item-media" style="width: 3rem;">
                                        <img src="../image/me/fb03.png" class="aui-img-round aui-list-img-sm">
                                    </div>
                                    <div class="aui-list-item-inner">
                                        <div class="aui-list-item-text">
                                            <div class="aui-list-item-title aui-font-size-14 text-bold">二手物品</div>
                                            
                                        </div>
                                        <div class="aui-list-item-text text-xs">
                                            二手物品管理
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                    <div class="aui-flex-item-6 padding-left-xs">
                        <ul class="aui-list aui-media-list huishou">
                            <li class="aui-list-item aui-list-item-middle">
                                <div class="aui-media-list-item-inner">
                                    <div class="aui-list-item-media" style="width: 3rem;">
                                        <img src="../image/me/fb04.png" class="aui-img-round aui-list-img-sm">
                                    </div>
                                    <div class="aui-list-item-inner">
                                        <div class="aui-list-item-text">
                                            <div class="aui-list-item-title aui-font-size-14 text-bold">废品回收</div>
                                            
                                        </div>
                                        <div class="aui-list-item-text text-xs">
                                            回收管理
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>

                <div class="text-black text-bold padding-top">我的发布</div>
                <div class="aui-flex-col margin-top">
                    <div class="aui-flex-item-6">
                        <div class="caigou margin-right bg-white">
                            <div class="text-center padding-top padding-bottom-xl">
                                <div class="img margin-top">
                                    <img src="../image/me/fb02.png">
                                </div>
                                <p class="text-bold">采购信息</p>
                                <p class="text-xs margin-top padding-bottom">采购管理</p>
                            </div>
                        </div>
                    </div>
                    <div class="aui-flex-item-6">
                        <div class="aui-flex-item-12 padding-right-xs margin-left-xs margin-bottom">
                            <ul class="aui-list aui-media-list ershou">
                                <li class="aui-list-item aui-list-item-middle padding-tb">
                                    <div class="aui-media-list-item-inner">
                                        <div class="aui-list-item-media" style="width: 3rem;">
                                            <img src="../image/me/fb03.png" class="aui-img-round aui-list-img-sm">
                                        </div>
                                        <div class="aui-list-item-inner">
                                            <div class="aui-list-item-text">
                                                <div class="aui-list-item-title aui-font-size-14 text-bold">二手物品</div>
                                                
                                            </div>
                                            <div class="aui-list-item-text text-xs">
                                                二手物品管理
                                            </div>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <div class="aui-flex-item-12 padding-right-xs margin-left-xs margin-top">
                            <ul class="aui-list aui-media-list huishou">
                                <li class="aui-list-item aui-list-item-middle">
                                    <div class="aui-media-list-item-inner">
                                        <div class="aui-list-item-media" style="width: 3rem;">
                                            <img src="../image/me/fb04.png" class="aui-img-round aui-list-img-sm">
                                        </div>
                                        <div class="aui-list-item-inner">
                                            <div class="aui-list-item-text">
                                                <div class="aui-list-item-title aui-font-size-14 text-bold">废品回收</div>
                                                
                                            </div>
                                            <div class="aui-list-item-text text-xs">
                                                回收管理
                                            </div>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>

                <div class="text-black text-bold padding-top">我的发布</div>
                <div class="aui-flex-col margin-top">
                    <div class="aui-flex-item-6">
                        <div class="huowu margin-right bg-white">
                            <div class="text-center padding-top padding-bottom-xl">
                                <div class="img margin-top">
                                    <img src="../image/me/fb01.png">
                                </div>
                                <p class="text-bold">货物信息</p>
                                <p class="text-xs margin-top padding-bottom">货品管理</p>
                            </div>
                        </div>
                    </div>
                    <div class="aui-flex-item-6">
                        <div class="aui-flex-item-12 padding-right-xs margin-left-xs margin-bottom">
                            <ul class="aui-list aui-media-list ershou">
                                <li class="aui-list-item aui-list-item-middle padding-tb">
                                    <div class="aui-media-list-item-inner">
                                        <div class="aui-list-item-media" style="width: 3rem;">
                                            <img src="../image/me/fb03.png" class="aui-img-round aui-list-img-sm">
                                        </div>
                                        <div class="aui-list-item-inner">
                                            <div class="aui-list-item-text">
                                                <div class="aui-list-item-title aui-font-size-14 text-bold">二手物品</div>
                                                
                                            </div>
                                            <div class="aui-list-item-text text-xs">
                                                二手物品管理
                                            </div>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <div class="aui-flex-item-12 padding-right-xs margin-left-xs margin-top">
                            <ul class="aui-list aui-media-list huishou">
                                <li class="aui-list-item aui-list-item-middle">
                                    <div class="aui-media-list-item-inner">
                                        <div class="aui-list-item-media" style="width: 3rem;">
                                            <img src="../image/me/fb04.png" class="aui-img-round aui-list-img-sm">
                                        </div>
                                        <div class="aui-list-item-inner">
                                            <div class="aui-list-item-text">
                                                <div class="aui-list-item-title aui-font-size-14 text-bold">废品回收</div>
                                                
                                            </div>
                                            <div class="aui-list-item-text text-xs">
                                                回收管理
                                            </div>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>

                <div class="text-black text-bold padding-top">常用工具</div>
                <div class="aui-content">
                    <ul class="aui-list aui-media-list bg0">
                        <li class="aui-list-item aui-list-item-middle margin-top padding bg-white">
                            <div class="aui-media-list-item-inner aui-list-item-arrow">
                                <div class="aui-list-item-media" style="width: 2rem;">
                                    <img src="../image/me/gj01.png" class="aui-img-round aui-list-img-sm">
                                </div>
                                <div class="aui-list-item-inner">
                                    资料信息
                                </div>
                            </div>
                        </li>
                        <li class="aui-list-item aui-list-item-middle margin-top padding bg-white">
                            <div class="aui-media-list-item-inner aui-list-item-arrow">
                                <div class="aui-list-item-media" style="width: 2rem;">
                                    <img src="../image/me/gj03.png" class="aui-img-round aui-list-img-sm">
                                </div>
                                <div class="aui-list-item-inner">
                                    我的收藏
                                </div>
                            </div>
                        </li>
                        <li class="aui-list-item aui-list-item-middle margin-top padding bg-white">
                            <div class="aui-media-list-item-inner aui-list-item-arrow">
                                <div class="aui-list-item-media" style="width: 2rem;">
                                    <img src="../image/me/gj05.png" class="aui-img-round aui-list-img-sm">
                                </div>
                                <div class="aui-list-item-inner">
                                    收货地址
                                </div>
                            </div>
                        </li>
                        <li class="aui-list-item aui-list-item-middle margin-top padding bg-white">
                            <div class="aui-media-list-item-inner aui-list-item-arrow">
                                <div class="aui-list-item-media" style="width: 2rem;">
                                    <img src="../image/me/gj06.png" class="aui-img-round aui-list-img-sm">
                                </div>
                                <div class="aui-list-item-inner">
                                    安全中心
                                </div>
                            </div>
                        </li>
                        <li class="aui-list-item aui-list-item-middle margin-top padding bg-white">
                            <div class="aui-media-list-item-inner aui-list-item-arrow">
                                <div class="aui-list-item-media" style="width: 2rem;">
                                    <img src="../image/me/gj07.png" class="aui-img-round aui-list-img-sm">
                                </div>
                                <div class="aui-list-item-inner">
                                    平台协议
                                </div>
                            </div>
                        </li>
                        <li class="aui-list-item aui-list-item-middle margin-top padding bg-white">
                            <div class="aui-media-list-item-inner aui-list-item-arrow">
                                <div class="aui-list-item-media" style="width: 2rem;">
                                    <img src="../image/me/gj08.png" class="aui-img-round aui-list-img-sm">
                                </div>
                                <div class="aui-list-item-inner">
                                    合同管理
                                </div>
                            </div>
                        </li>
                        <li class="aui-list-item aui-list-item-middle margin-top padding bg-white">
                            <div class="aui-media-list-item-inner aui-list-item-arrow">
                                <div class="aui-list-item-media" style="width: 2rem;">
                                    <img src="../image/me/gj09.png" class="aui-img-round aui-list-img-sm">
                                </div>
                                <div class="aui-list-item-inner">
                                    平台介绍
                                </div>
                            </div>
                        </li>
                        <li class="aui-list-item aui-list-item-middle margin-top padding bg-white">
                            <div class="aui-media-list-item-inner aui-list-item-arrow">
                                <div class="aui-list-item-media" style="width: 2rem;">
                                    <img src="../image/me/gj02.png" class="aui-img-round aui-list-img-sm">
                                </div>
                                <div class="aui-list-item-inner">
                                    平台客服
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="bottombox text-center text-xs">
                <div>系统版本 V1.0.0</div>
                <div>©云钢才版权所有</div>
            </div>
        </div>
    </div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/vue.js"></script>
<script type="text/javascript">

    var vm = {
        el: '#app',
        data: {
            list: []
        },
        mounted: function(){
            this.getList();
        },
        methods: {
            getList: function(){
                let that = this;
            }
        }
    }
    apiready = function() {
        $api.fixStatusBar(
            $api.byId("header")
        );
        window.app = new Vue(vm);


    };

    function backpage(){
        api.closeWin({
            name: api.winName
        })
        
    }

</script>

</html>
